﻿<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
    <link href="ext/resources/css/ext-all.css" rel="stylesheet" type="text/css" />
    <script src="ext/ext-all-dev.js" type="text/javascript"></script>
    <script src="ext/ext-lang-es.js" type="text/javascript"></script>
    <!--<script src="js/app.js" type="text/javascript"></script>-->
   <!-- <script src="MyApp/test/LifecycleExample.js" type="text/javascript"></script>-->
    <!--<script src="MyApp/container/MyContainer.js" type="text/javascript"></script>-->
    <script src="MyApp/models/Invoice.js" type="text/javascript"></script>
    <script src="MyApp/store/Invoices.js" type="text/javascript"></script>
    <script src="MyApp/models/Item.js" type="text/javascript"></script>
    <script type="text/javascript">
        Ext.onReady(function () {
            //            var taky = Ext.create('MyApp.single.Skater', {
            //                name: 'Taky',
            //                nationality: 'Japan'
            //            });
            //            taky.compete();
            //            taky.combination();

            //            taky.mixins.spin.combination();
            //            taky.mixins.jump.combination();

            //            var susan = Ext.create('MyApp.dancing.Skater', {
            //                name: 'Susan',
            //                nationality: 'USA'
            //            });
            //            susan.compete();

            //            var invoice = Ext.create('MyApp.data.Invoice', {
            //                cliente: 'Instalar 4x4',
            //                subtotal: 100,
            //                total: 108.3
            //            });
            //            console.log(invoice.getCliente());
            //            console.log(invoice.getSubtotal());
            //            console.log(invoice.getImpuesto());
            //            console.log(invoice.getTotal());

            //            invoice.setImpuesto(0.16);

            //            console.log(invoice.getImpuesto());

            //            invoice.setSubtotal(1000);
            //            console.log(invoice.getTotal());

            //            Ext.create('MyApp.data.Client');
            //            Ext.create('MyApp.data.Client');
            //            Ext.create('MyApp.data.Client');

            //console.log(MyApp.Constants.BASE_PATH);
            //Ext.create('MyApp.Constants'); //este da error porque un singleton no puede ser instanciado


            //            Ext.create('widget.mypanel', {
            //                renderTo: Ext.getBody()
            //            });

            //            Ext.ClassManager.instantiateByAlias('widget.mypanel', {
            //                renderTo: Ext.getBody()
            //            })

            //            Ext.ClassManager.instantiate('widget.mypanel', {
            //                renderTo: Ext.getBody()
            //            });

            //            var win = Ext.create('Ext.window.Window', {
            //                title: 'Window',
            //                width: 350,
            //                height: 250,
            //                items: [{
            //                    xtype: 'mypanel'
            //                }]
            //            });
            //            win.show();

            //            Ext.create('MyApp.test.LifecycleExample', {
            //                renderTo : Ext.getBody()           
            //            });

            //            Ext.create('MyApp.container.MyContainer', {
            //                renderTo: Ext.getBody(),
            //                defaults: {
            //                    xtype : 'component',
            //                    width: 100
            //                },
            //                items: [{
            //                    //xtype: 'component',
            //                    html: 'Primer componente'
            //                }, {
            //                    //xtype: 'component',
            //                    html : 'Segundo componente'
            //                }]
            //            });

            //            var panel = Ext.create('Ext.panel.Panel', {
            //                renderTo: Ext.getBody(),
            //                title: 'Primer panel',
            //                width: 300,
            //                height: 200,
            //                html: 'Contenido del panel',
            //                collapsible : true,
            //                tools: [
            //                    { type: 'help' },
            //                    { type: 'search' },
            //                    { type: 'gear' },
            //                    { type: 'print' }
            //                ],
            //                dockedItems: [{
            //                    xtype: 'toolbar',
            //                    dock: 'top',
            //                    items: ['Top toolbar']
            //                }, {
            //                    xtype: 'toolbar',
            //                    dock: 'bottom',
            //                    items: ['Bottom toolbar']
            //                }, {
            //                    xtype: 'toolbar',
            //                    dock: 'left',
            //                    items: ['Left<br /> toolbar']
            //                }, {
            //                    xtype: 'toolbar',
            //                    dock: 'right',
            //                    items: ['Right<br /> toolbar']
            //                }]
            //            });
            //            panel.center();

            //var win = Ext.create('Ext.window.Window', {
            //    title: 'Primera ventana',
            //    width: 600,
            //    height: 400,
            //    maximizable: true,
            //    //layout : 'card',//fit,card 
            //    layout: {
            //        type : 'hbox',
            //        align : 'stretch'//top, strech
            //    },
            //    defaults: {
            //        xtype: 'panel',
            //        height: 60
            //        //border: false
            //    },
            //    items: [{
            //        title: 'Menu',
            //        html: 'Menu principal',
            //        flex : 1
            //    }, {
            //        title: 'Contenido',
            //        html: 'Contenido principal',
            //        flex : 2
            //    }]
            //});
            //win.show();
            /*
            setTimeout(function () {
            win.getLayout().setActiveItem(1); //solo para el layout card
            }, 2000);*/

            //var win = Ext.create('Ext.window.Window', {
            //    title: 'Mi primera ventana',
            //    width: 300,
            //    height: 200,
            //    maximizable: true,
            //    layout: 'border',
            //    defaults: {
            //        xtype: 'panel',
            //        height : 60
            //    },
            //    items: [{
            //        title: 'Menú',
            //        html: 'El menu principal',
            //        region: 'west',
            //        width: 100,
            //        collapsible: true,
            //        split : true
            //    },{
            //        title: 'Contenido',
            //        html: 'El contenido principal',
            //        region : 'center'
            //    }]
            //});
            //win.show();

            //            var win = Ext.create('Ext.window.Window', {
            //                title: 'Mi primera ventana',
            //                width: 300,
            //                height: 200,
            //                maximizable: true,
            //                layout: {
            //                    type: 'accordion'
            //                   // align : 'stretch'
            //                },
            //                defaults: {
            //                    xtype: 'panel'                    
            //                },
            //                items: [{
            //                    title: 'Menú',
            //                    html : 'Menú principal'
            //                }, {
            //                    title: 'Contenido',
            //                    html : 'El contenido'
            //                }, {
            //                    title: '3ra Columna',
            //                    html : 'Mas contenido'
            //                }]
            //            });
            //            win.show();

            //            Ext.Ajax.request({
            //                url: '/clasesNET/solicitud.ashx',
            //                //params: { x: 1, y: 2, z: 3 },
            //                params: 'x=1&y=2&z=3',
            //                success: function (response, options) {
            //                    var data = Ext.decode(response.responseText);
            //                    Ext.Msg.alert('Mensaje', data.msg);
            //                },
            //                failure: function (response, options) {

            //                }
            //            });

            //            console.log('Proxima línea de codigo');

            //            var invoice = Ext.create('MyApp.models.Invoice', {
            //                taxId: '12345',
            //                dateIssued: '2012-01-25 09:13:22',
            //                name: 'Mr. Doe',
            //                address: 'Calle Punta Pejerrey Mz3F Lt9 LIMA PERU'
            //            });
            //            //console.log(invoice);

            //            var name = invoice.get('name');

            //            invoice.set('name', 'Mr. Smith');
            //            console.log('Nombre antiguo :', name);
            //            console.log('Nombre actual : ', invoice.get('name'));

            //            invoice.set({
            //                taxId: 54321,
            //                address: 'En DIGESA'
            //            });

            //            console.log(invoice.data.address);

            //            invoice.data.address = 'NUEVA DIRECCION';

            //            console.log(invoice.get('address'));

            //            var invoice = Ext.create('MyApp.models.Invoice', {
            //                taxId: '12345',
            //                date: '2012-01-25 09:30:50',
            //                name: 'Kurt Cobain',
            //                address: 'Calle Punta Pejerrey Mz3F Lt9 LIMA PERU'
            //            });

            //            if (invoice.isValid()) {
            //                console.log('Sin errores');
            //            } else {
            //                var errors = invoice.validate();

            //                errors.each(function (error) {
            //                    console.log(error.field, error.message);
            //                });
            //            }

            //            var invoice = Ext.create('MyApp.models.Invoice', {
            //                taxId: '12345',
            //                date: '2012-01-25 09:30:50',
            //                name: 'Kurt Cobain',
            //                address: 'Calle Punta Pejerrey Mz3F Lt9 LIMA PERU'
            //            });

            //            invoice.getItems().add(
            //                { cantidad: 10, descripcion: 'Servicios de Desarrollo', precioUnit: 65, subtotal: 650 },
            //                { cantidad: 20, descripcion: 'Servicios de Diseño', precioUnit: 55, subtotal: 1100 }
            //            );

            //            invoice.getItems().each(function (item) {
            //                console.log(item.get('descripcion'));
            //            });

            var invoice = Ext.create("MyApp.models.Invoice", {
                taxId: "32FG83",
                name: "John Doe",
                address: "123 ST, TN USA",
                creditCard: "1234567890123456"
            });

            var model1 = Ext.create("MyApp.models.Invoice", {
                taxId: "3E72KO",
                name: "Carl Jr",
                address: "789 ST, TX USA",
                creditCard: "1234567890123456"
            });
            var model2 = Ext.create("MyApp.models.Invoice", {
                taxId: "897HG56",
                name: "Hazel Doe",
                address: "987 ST, CA USA",
                creditCard: "1234567890123456"
            });

            var store = Ext.create('MyApp.store.Invoices');

            store.add(invoice);
            store.add({
                taxID: 'A4G-487',
                name: 'Cesar Bocanegra',
                address: 'LA MOLINA - LIMA - PERU',
                creditCard: '1234567890123456'
            });
            store.add([model1, model2]);

            store.insert(0, {
                taxId: "L125AP",
                name: "John Smith",
                address: "159 ST, TX USA",
                creditCard: "1234567890123456"
            });

            console.log(store.count());

            store.each(function (record, index) {
                console.log(index, record.get('name'));
            });

            var model3 = store.getAt(2);
            console.log(model3.get('name'));

            var first = store.first(), last = store.last();
            console.log(first.get('name'), last.get('name'));

            var list = store.getRange(1, 3);

            Ext.each(list, function (record, index) {
                console.log(index, record.get('name'));
            });

            var newelements = store.getNewRecords();
            Ext.each(newelements, function (record, index) {
                console.log(record.getId(), record.get('Name'));
            });

            /* */
            store.add({
                idInvoice: 672,
                taxId: 'VI8732',
                name: 'Alan Garcia',
                address: '124 los portales LIMA PERU',
                creditCard: '123456798'
            });

            var model4 = store.last();
            model4.set('name', 'EddyMcFly');

            var updated = store.getUpdatedRecords();
            Ext.each(updated, function (record, index) {
                console.log(record.getId(), record.get('name'));
            });

            store.remove(model1);
            store.each(function (record, index) {
                console.log(record.get('name'));
            });

            store.removeAt(2);
            store.each(function (record, index) {
                console.log(index, record.get('name'));
            });

            store.removeAll();
            console.log('Records : ', store.count());

        });
    </script>
    <title></title>
</head>
<body>

</body>
</html>
